body{
    margin: 0px;
    margin-top: 0px;
    background-color: rgb(233, 231, 230);
   }

.top {/*親div*/
    position: relative;/*相対配置*/
    }
  
    .top ul {
        position: absolute;/*絶対配置*/
        font-weight: bold; /*太字に*/
        font-size: 2em;/*サイズ2倍*/
        text-decoration: none;
        list-style: none;
        top: 68%;
        left: 29.8%;
        -ms-transform: translate(-50%,-50%);
        -webkit-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        margin:0;
        padding:0;
        font-size: 2.7vw;
        }

.top ul li a{text-decoration: none;
            color:rgba(82, 82, 82, 0.89);
            }
.top ul li.current a{color: rgb(45, 54, 138);
            }
.top ul li a:hover{color: rgb(30, 155, 78);
            }
  
.top {height: 50%;

}

.top img {
    height: 50%;
    width:45%;
    text-align: center;
    }

 footer p{
        text-align: center;
        font-size: 14px;
        color: gray;
        margin-top: 40px;
        }
        

        .container{
            height: 58vw;
            width: 100vw;
            position: center;
          }
          
          .image {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            opacity: 0;
            background-size: cover;
            background-position: center center;
            
            animation: image-switch-animation 68s infinite;
          }
          
          .src1 {
            background-image: url(https://hirokimochizuki.com/0.jpg);
          }
          .src2 {
            background-image: url(https://hirokimochizuki.com/1.jpg);
          }
          .src3 {
            background-image: url(https://hirokimochizuki.com/2.jpg);
          }
          .src4 {
            background-image: url(https://hirokimochizuki.com/3.jpg);
          }
          .src5 {
            background-image: url(https://hirokimochizuki.com/4.jpg);
          }
          .src6 {
            background-image: url(https://hirokimochizuki.com/5.jpg);
          }
          .src7 {
            background-image: url(https://hirokimochizuki.com/6.jpg);
          }
          .src8 {
            background-image: url(https://hirokimochizuki.com/7.jpg);
          }
          .src9 {
            background-image: url(https://hirokimochizuki.com/8.jpg);
          }
          .src10 {
            background-image: url(https://hirokimochizuki.com/9.jpg);
          }
          .src11 {
            background-image: url(https://hirokimochizuki.com/10.jpg);
          }
          .src12 {
            background-image: url(https://hirokimochizuki.com/11.jpg);
          }
          .src13 {
            background-image: url(https://hirokimochizuki.com/12.jpg);
          }
          .src14 {
            background-image: url(https://hirokimochizuki.com/13.jpg);
          }
          .src15 {
            background-image: url(https://hirokimochizuki.com/14.jpg);
          }
          .src16 {
            background-image: url(https://hirokimochizuki.com/15.jpg);
          }
          .src17 {
            background-image: url(https://hirokimochizuki.com/18.jpg);
          }


          .image:nth-of-type(1) {
            animation-delay: 0s;
          }
          .image:nth-of-type(2) {
            animation-delay: 4s;
          }
          .image:nth-of-type(3) {
            animation-delay: 8s;
          }
          .image:nth-of-type(4) {
            animation-delay: 12s;
          }
          .image:nth-of-type(5) {
            animation-delay: 16s;
          }
          .image:nth-of-type(6) {
            animation-delay: 20s;
          }
          .image:nth-of-type(7) {
            animation-delay: 24s;
          }
          .image:nth-of-type(8) {
            animation-delay: 28s;
          }
          .image:nth-of-type(9) {
            animation-delay: 32s;
          }
          .image:nth-of-type(10) {
            animation-delay: 36s;
          }
          .image:nth-of-type(11) {
            animation-delay: 40s;
          }
          .image:nth-of-type(12) {
            animation-delay: 44s;
          }
          .image:nth-of-type(13) {
            animation-delay: 48s;
          }
          .image:nth-of-type(14) {
            animation-delay: 52s;
          }
          .image:nth-of-type(15) {
            animation-delay: 56s;
          }
          .image:nth-of-type(16) {
            animation-delay: 60s;
          }
          .image:nth-of-type(17) {
            animation-delay: 64s;
          }
          
          @keyframes image-switch-animation {
            0%{ opacity: 0;}
            5%{ opacity: 1;}
            25%{ opacity: 1;}
            30%{ opacity: 0;}
            100%{ opacity: 0;}
          }